<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录界面</title>
</head>

<body>
    <div>
        <table>
            <tr>
                <td><label for="">账号：</label></td>
                <td><input type="text" id="name"></td>
            </tr>

            <tr>
                <td><label for="">密码：</label></td>
                <td><input type="password" id="password"></td>
            </tr>

            <tr>
                <td><input type="button" value="登录" onclick="login()"></td>
                <td><input type="button" value="取消"></td>
            </tr>
        </table>
    </div>

    <script src="./js/jquery-3.6.0.min.js"></script>
    <script>
        function login() {
            let name = $('#name').val()
            let password = $('#password').val()
            // 控制台是否拿到数据
            console.log(name, password);

            let obj = {
                name, password
            }

            // 发送请求
            $.post('http://localhost:8000/login', obj, (res) => {
                if (res.code == 1000) {
                    location.href = './index.html'
                } else {
                    alert('账号密码错误，请重新输入')
                }
            })
        }
    </script>
</body>

</html>